/**
 * Created by SylarSong on 16/12/7.
 */



//************获取上一个月***************
function getPreMonth(date) {
    /**
     * @param: data    例如  new Date()
     * @param: return  时间戳  例如  new Date().getTime()
     * **/
    if (!date)date = new Date();
    var year = date.getFullYear(); //获取当前日期的年份
    var month = date.getMonth(); //获取当前日期的月份
    var day = date.getDate(); //获取当前日期的日
    var oneDay = 1000 * 3600 * 24 * 1;
    var days = new Date(year, month, 0).getDate(); //获取当前日期中月的天数
    var current_time = date.getTime();
    var after_time = current_time - (oneDay * days);
    return after_time;
}
//************获取当前以前N天日期信息***************
/**
 * 用户获取当前日期往前N天的日期数组
 * @param cycle   例如: 7 = 1周, 30=1月;
 * @returns {Array.<*>}  例如:["12-5","12-6","12-7"]
 */
function getPerDay(cycle) {
    var res = [];
    var oneDay = 1000 * 3600 * 24 * 1;
    var now = new Date().getTime();
    for (var i = 0; i < cycle; i++) {
        res.push([new Date(now).getMonth() + 1, new Date(now).getDate()].join("-"))
        now -= oneDay;
    }
    return res.reverse()
}

//************制作N个随机数据***************
/**
 * 制作 N个 随机数据
 * @param n   数据个数
 * @param f   数据随机范围  0~f
 * @returns {Array.<*>} 例如:[454,21,254];
 */
function getRandomData(n, f) {
    var res = [];
    for (var i = 0; i < n; i++) {
        res.push(Math.floor(Math.random() * f));
    }
    return res.reverse();
}
/**
 *  * 用于生成测试用的 dataJson
 * @param keys  charts的键,使用数组表示  ['a','b','c']
 * @param f 随机范围 0~f
 * @returns {{}} 出入数据Json格式  例如:{'all':555,'charts':{'key1':111,'key2':222}}
 */

function getRandomJson(keys,f) {
    var dataJson = {}
    var all = 0
    dataJson['charts']={}
    for(var i=0;i<keys.length;i++){
        dataJson.charts[keys[i]]= Math.floor(Math.random()*f);
        all += dataJson.charts[keys[i]];
    }
    dataJson['all']=all;
    return dataJson;
}
//************获取图表(echarts)实例******************
var line_bar_first_pay = echarts.init($('#line-bar-first-pay')[0]); // 首冲金额
var line_bar_pay_type = echarts.init($('#line-bar-pay-type')[0]); // 首冲类型
var line_bar_pay_props = echarts.init($('#line-bar-pay-props')[0]); // 首冲类型


//!!!!!!!!!!!!!!!准备时间!!!!!!!!!!!!!
$(document).ready(function () {

    get_pay_cycle(line_bar_first_pay,getRandomJson(["218元","60元","25元"].reverse(),100));
    render_first_recharge_distributed();

    
    get_pay_cycle(line_bar_pay_type,getRandomJson(["首冲12元礼包","首冲68元礼包","首冲306钻石包","首冲680钻石包"],150));
    get_pay_props_cycle(line_bar_pay_props,getRandomJson(["道具1","道具2","道具3","道具4","道具5","道具6","道具7"],150));

    $('#first_recharge_distributed_form').submit(function(){
        render_first_recharge_distributed($(this).serialize());
        return false;
    });

});

function render_first_recharge_distributed(params){
    if(!params){
        params = {
            '_': $.now(),
            'first_recharge_distributed_start_date': first_recharge_distributed_start_date,
            'first_recharge_distributed_end_date': first_recharge_distributed_end_date
        };
    }else{
        params += '&_=' + $.now();
    }

    $.get('/stats_ajax/first_recharge_distributed', params, function(data){
        get_pay_cycle(line_bar_first_pay, data);
    });

}

//!!!!!!!!改变尺寸触发!!!!!!!!!!!!
window.onresize = function () {
    $('#line-bar-first-pay').width($(".grid-12") - 50);
    line_bar_first_pay.resize();
    $('#line-bar-pay-type').width($(".grid-12") - 50);
    line_bar_pay_type.resize();
};


//*首冲金额人数分布图********************************************
/**
 * 用于统计不同首冲金额人数的 图标
 * @param instance echarts初始化的实例, 例如: echarts.init($('#line-bar-newPay-allPay')[0]);
 * @param dataJson 出入数据Json格式  例如:{'all':555,'charts':{'key1':111,'key2':222}}
 */
function get_pay_cycle(instance, dataJson) {
    if (!dataJson) {
        dataJson = {
            "all": 10887,
            "charts": {
                ">12周": 1592,
                "9~12周": 1624,
                "8周": 1842,
                "7周": 2090,
                "6周": 1762,
                "5周": 1593,
                "4周": 2060,
                "3周": 1537,
                "2周": 1908,
                "4~7日": 2107,
                "2~3日": 2405,
                "首日": 7355
            }
        };
    }

    option = {
        backgroundColor: {
            type: 'pattern',
            repeat: 'repeat'
        },
        tooltip: {

            formatter: "{b}元 : {c}"
        },
        title: [{
            text: '首冲人数分布',
            subtext: '总计 ' + dataJson.all,
            x: '25%',
            textAlign: 'center'
        }, {
            text: '各区间占比',
            subtext: '总计 ' + Object.keys(dataJson.charts).reduce(function (all, key) {
                return all + dataJson.charts[key];
            }, 0),
            x: '84%',
            textAlign: 'center'
        },],
        grid: [{
            top: 50,
            width: '60%',
            bottom: '0%',
            left: 10,
            containLabel: true
        }],
        xAxis: [{
            type: 'value',
            splitLine: {
                show: false
            }
        }],
        yAxis: [{
            type: 'category',
            data: Object.keys(dataJson.charts),
            axisLabel: {
                interval: 0,
                rotate: 20
            },
            splitLine: {
                show: true
            }
        }],
        series: [{
            type: 'bar',
            stack: 'chart',
            z: 3,
            label: {
                normal: {
                    position: 'right',
                    show: true
                }
            },
            data: Object.keys(dataJson.charts).map(function (key) {
                return dataJson.charts[key];
            })
        }, {
            type: 'pie',
            radius: [0, '60%'],
            center: ['85%', '50%'],
            data: Object.keys(dataJson.charts).map(function (key) {
                return {
                    name: key,
                    value: dataJson.charts[key]
                }
            })
        },],
        color: ["#EE3A8C", "#006600", "#99ff99", "#660000", "#99ffcc", "#99ffff"]
    }
    instance.setOption(option);
}

//*首冲金额人数分布图********************************************
/**
 * 用于统计不同首冲金额人数的 图标
 * @param instance echarts初始化的实例, 例如: echarts.init($('#line-bar-newPay-allPay')[0]);
 * @param dataJson 出入数据Json格式  例如:{'all':555,'charts':{'key1':111,'key2':222}}
 */
function get_pay_props_cycle(instance, dataJson) {
    if (!dataJson) {
        dataJson = {
            "all": 10887,
            "charts": {
                ">12周": 1592,
                "9~12周": 1624,
                "8周": 1842,
                "7周": 2090,
                "6周": 1762,
                "5周": 1593,
                "4周": 2060,
                "3周": 1537,
                "2周": 1908,
                "4~7日": 2107,
                "2~3日": 2405,
                "首日": 7355
            }
        };
    }


    option = {
        backgroundColor: {
            type: 'pattern',
            repeat: 'repeat'
        },
        tooltip: {
            formatter: "{a} <br/>{b} : {c}"
        },
        title: [{
            text: '道具购买分布',
            subtext: '总计 ' + dataJson.all,
            x: '25%',
            textAlign: 'center'
        }, {
            text: '各区间占比',
            subtext: '总计 ' + Object.keys(dataJson.charts).reduce(function (all, key) {
                return all + dataJson.charts[key];
            }, 0),
            x: '84%',
            textAlign: 'center'
        },],
        grid: [{
            top: 50,
            width: '60%',
            bottom: '0%',
            left: 10,
            containLabel: true
        }],
        xAxis: [{
            type: 'category',
            data: Object.keys(dataJson.charts),

            splitLine: {
                show: true
            }
        }],
        yAxis: [{
            type: 'value',
            splitLine: {
                show: false
            }
        }],

        series: [{
            type: 'bar',
            stack: 'chart',
            z: 3,
            label: {
                normal: {
                    position: 'right',
                    show: true
                }
            },
            data: Object.keys(dataJson.charts).map(function (key) {
                return dataJson.charts[key];
            })
        }, {
            type: 'pie',
            radius: [0, '60%'],
            center: ['85%', '50%'],
            data: Object.keys(dataJson.charts).map(function (key) {
                return {
                    name: key,
                    value: dataJson.charts[key]
                }
            })
        },],
        color: ["#191970", "#006600", "#99ff99", "#660000", "#99ffcc", "#99ffff","#8B4513"]
    }
    instance.setOption(option);
}